<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <!-- 引入jQuery库 -->
    <script src="https://cdn.bootcss.com/jquery/3.5.1/jquery.min.js"></script>

    <!-- 引入Bootstrap库 -->
    <link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css">
    <script src="https://cdn.bootcss.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>

    <!-- 引入bootstrap-table库 -->
    <link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap-table/1.16.0/bootstrap-table.min.css">
    <script src="https://cdn.bootcss.com/bootstrap-table/1.16.0/bootstrap-table.min.js"></script>

    <!-- 引入bootstrap-table-tree插件 -->
    <script src="https://cdn.bootcss.com/bootstrap-table/1.16.0/extensions/tree/bootstrap-table-tree.min.js"></script>

</head>

<body>

<table>
    <thead>
    <tr>
        <th>列1</th>
        <th>列2</th>
        <th>操作</th>
    </tr>
    </thead>
    <tbody>
    <tr>
        <td>行1列1</td>
        <td>行1列2</td>
        <td><button id="add-row-1">添加子项</button></td>
    </tr>
    <tr>
        <td>行2列1</td>
        <td>行2列2</td>
        <td><button id="add-row-2">添加子项</button></td>
    </tr>
    <!-- 更多行 -->
    </tbody>
</table>

<script>
    // 为每个按钮添加点击事件监听器
    document.getElementById('add-row-1').addEventListener('click', function() {
        // 在行1下面添加一个新行作为子项
        var newRow = document.createElement('tr');
        newRow.innerHTML = '<td>行1子项1</td><td>行1子项2</td><td></td>';
        this.parentNode.parentNode.parentNode.insertBefore(newRow, this.parentNode.parentNode.nextSibling);
    });

    document.getElementById('add-row-2').addEventListener('click', function() {
        // 在行2下面添加一个新行作为子项
        var newRow = document.createElement('tr');
        newRow.innerHTML = '<td>行2子项1</td><td>行2子项2</td><td></td>';
        this.parentNode.parentNode.parentNode.insertBefore(newRow, this.parentNode.parentNode.nextSibling);
    });

    // 更多按钮和操作
</script>

</body>
</html>